import * as NS from "../../../Common/NetServices";
import { IsNull } from "../../../TYLibrary/Common/GlobalExtend";
import { Wx_XSPPage } from "../../../Common/Entitys";
import { Log } from "../../../TYLibrary/System/Logger";
import { Wx_PageData, WXDataClassRuntimeDecorator } from "../../../Common/EntityBase";
import { TimeSpan } from "../../../TYLibrary/System/System";

@WXDataClassRuntimeDecorator()
class ManagementPageData extends Wx_PageData {
    public flag: boolean = false;
    public tabIndex: number = 0;
    public optionsListData = [];
    public movableViewPosition: any = {
        x: 0,
        y: 0,
        className: "none",
        data: {}
    };
    public scrollPosition1: any = {
        everyOptionCell: 190,
        top: 47,
        scrollTop: 0,
        scrollY: true,
        scrollViewHeight: 1000,
        scrollViewWidth: 375,
        windowViewHeight: 1000,
    };
    public scrollPosition2: any = {
        everyOptionCell: 50,
        everyOptionCell_Width: 50,
        top: 47,
        left: 20,
        scrollTop: 0,
        scrollLeft: 0,
        scrollY: true,
        scrollViewHeight: 1000,
        scrollViewWidth: 375,
        windowViewHeight: 1000,
    };
    public selectItemInfo: any = {
        sName: "",
        sDtSecCode: "",
        sCode: "",
        selectIndex: -1,
        selectPosition: 0,
    };
}

class IndexPage extends Wx_XSPPage {
    public Data: ManagementPageData = new ManagementPageData();

    /**
     * 初始化页面信息
     * @param {any} options
     * @returns {Promise<void>}
     * @memberof IndexPage
     */
    public async InitData(options: any): Promise<void> {
        var systemInfo = wx.getSystemInfoSync();
        var optionsList = [
            { "sCode": "600879", "sDtSecCode": "0101600879", "sName": "新品 甜曲紫米面包1100g 买一赠一实...", "iUpdateTime": 1496362315, "fNow": "--", "sRate": "--", "className": "block_wave block_stop", "srcimg": "https://www.e-taiyun.cn/XCXFiles/xsp/img/pic/pic_16.jpg" },
            { "sCode": "00700", "sDtSecCode": "020100700", "sName": "新品 甜曲紫米面包1100g 买一赠一实...", "iUpdateTime": 1495531418, "fNow": "--", "sRate": "--", "className": "block_wave block_stop", "srcimg": "https://www.e-taiyun.cn/XCXFiles/xsp/img/pic/pic_16.jpg" },
            { "sCode": "000759", "sDtSecCode": "0001000759", "sName": "认养一头牛 原味酸奶 200gx12盒x2提装", "iUpdateTime": 1495531394, "fNow": "--", "sRate": "--", "className": "block_wave block_stop", "srcimg": "https://www.e-taiyun.cn/XCXFiles/xsp/img/pic/pic_18.jpg" },
            { "sCode": "000651", "sDtSecCode": "0001000651", "sName": "新品 甜曲紫米面包1100g 买一赠一实...", "iUpdateTime": 1495531384, "fNow": "--", "sRate": "--", "className": "block_wave block_stop", "srcimg": "https://www.e-taiyun.cn/XCXFiles/xsp/img/pic/pic_17.jpg" },
            { "sCode": "600036", "sDtSecCode": "0101600036", "sName": "新品 甜曲紫米面包1100g 买一赠一实...", "iUpdateTime": 1495153104, "fNow": "--", "sRate": "--", "className": "block_wave block_stop", "srcimg": "https://www.e-taiyun.cn/XCXFiles/xsp/img/pic/pic_19.jpg" },
            { "sCode": "600518", "sDtSecCode": "0101600518", "sName": "认养一头牛 原味酸奶 200gx12盒x2提装", "iUpdateTime": 1495153089, "fNow": "--", "sRate": "--", "className": "block_wave block_stop", "srcimg": "https://www.e-taiyun.cn/XCXFiles/xsp/img/pic/pic_15.jpg" },
            { "sCode": "601238", "sDtSecCode": "0101601238", "sName": "认养一头牛 原味酸奶 200gx12盒x2提装", "iUpdateTime": 1495153077, "fNow": "--", "sRate": "--", "className": "block_wave block_stop", "srcimg": "https://www.e-taiyun.cn/XCXFiles/xsp/img/pic/pic_14.jpg" },
            { "sCode": "601989", "sDtSecCode": "0101601989", "sName": "认养一头牛 原味酸奶 200gx12盒x2提装", "iUpdateTime": 1495153069, "fNow": "--", "sRate": "--", "className": "block_wave block_stop", "srcimg": "https://www.e-taiyun.cn/XCXFiles/xsp/img/pic/pic_13.jpg" },
            { "sCode": "600519", "sDtSecCode": "0101600519", "sName": "认养一头牛 原味酸奶 200gx12盒x2提装", "iUpdateTime": 1495153058, "fNow": "--", "sRate": "--", "className": "block_wave block_stop", "srcimg": "https://www.e-taiyun.cn/XCXFiles/xsp/img/pic/pic_16.jpg" },
            { "sCode": "002230", "sDtSecCode": "0001002230", "sName": "认养一头牛 原味酸奶 200gx12盒x2提装", "iUpdateTime": 1495152519, "fNow": "--", "sRate": "--", "className": "block_wave block_stop", "srcimg": "https://www.e-taiyun.cn/XCXFiles/xsp/img/pic/pic_16.jpg" },
            { "sCode": "002431", "sDtSecCode": "0001002431", "sName": "新品 甜曲紫米面包1100g 买一赠一实...", "iUpdateTime": 1494776256, "fNow": "--", "sRate": "--", "className": "block_wave block_stop", "srcimg": "https://www.e-taiyun.cn/XCXFiles/xsp/img/pic/pic_16.jpg" },
            { "sCode": "01357", "sDtSecCode": "020101357", "sName": "新品 甜曲紫米面包1100g 买一赠一实...", "iUpdateTime": 1494480437, "fNow": "--", "sRate": "--", "className": "block_wave block_stop", "srcimg": "https://www.e-taiyun.cn/XCXFiles/xsp/img/pic/pic_16.jpg" },
            { "sCode": "300222", "sDtSecCode": "0001300222", "sName": "新品 甜曲紫米面包1100g 买一赠一实...", "iUpdateTime": 1493777483, "fNow": "--", "sRate": "--", "className": "block_wave block_stop", "srcimg": "https://www.e-taiyun.cn/XCXFiles/xsp/img/pic/pic_16.jpg" },
            { "sCode": "300131", "sDtSecCode": "0001300131", "sName": "新品 甜曲紫米面包1100g 买一赠一实...", "iUpdateTime": 1493777479, "fNow": "--", "sRate": "--", "className": "block_wave block_stop", "srcimg": "https://www.e-taiyun.cn/XCXFiles/xsp/img/pic/pic_16.jpg" },
            { "sCode": "001696", "sDtSecCode": "0001001696", "sName": "新品 甜曲紫米面包1100g 买一赠一实...", "iUpdateTime": 1493777476, "fNow": "--", "sRate": "--", "className": "block_wave block_stop", "srcimg": "https://www.e-taiyun.cn/XCXFiles/xsp/img/pic/pic_16.jpg" },
            { "sCode": "600503", "sDtSecCode": "0101600503", "sName": "新品 甜曲紫米面包1100g 买一赠一实...", "iUpdateTime": 1493777473, "fNow": "--", "sRate": "--", "className": "block_wave block_stop", "srcimg": "https://www.e-taiyun.cn/XCXFiles/xsp/img/pic/pic_16.jpg" },
            { "sCode": "300154", "sDtSecCode": "0001300154", "sName": "认养一头牛 原味酸奶 200gx12盒x2提装", "iUpdateTime": 1493177346, "fNow": "--", "sRate": "--", "className": "block_wave block_stop", "srcimg": "https://www.e-taiyun.cn/XCXFiles/xsp/img/pic/pic_14.jpg" },
            { "sCode": "300104", "sDtSecCode": "0001300104", "sName": "认养一头牛 原味酸奶 200gx12盒x2提装  ", "iUpdateTime": 1483691763, "fNow": "--", "sRate": "--", "className": "block_wave block_stop", "srcimg": "https://www.e-taiyun.cn/XCXFiles/xsp/img/pic/pic_15.jpg" }];
        //  optionsList = this._optionsDataTranlate(optionsList, "");
        // 开始加载页面
        var scrollViewHeight = systemInfo.windowHeight - 47;
        var scrollViewWidth = systemInfo.windowWidth;
        this.Data.optionsListData = optionsList;
        this.Data.scrollPosition1.scrollViewWidth = scrollViewWidth;
        this.Data.scrollPosition1.scrollViewHeight = scrollViewHeight;
        this.Data.scrollPosition1.windowViewHeight = systemInfo.windowHeight;
        this.Data.flag = false;
        this.Data.tabIndex = 0;
        this.Data.ApplyChange(this);
    }

    /**
     * 
     * @param {*} e
     * @returns {void}
     * @memberof IndexPage
     */
    public bindToggleHandler(e: any): void {
        if (this.Data.flag == false) {
            this.Data.flag = true;
            this.Data.ApplyChange(this);
            this.Data.flag = true;
        } else {
            this.Data.flag = false;
            this.Data.ApplyChange(this);
            this.Data.flag = false;
        }
    }

    /**
     * 
     * @param {*} e
     * @returns {void}
     * @memberof IndexPage
     */
    public bindscrollHandler(e: any): void {
        var scrollTop = e.detail.scrollTop;
        var scroll;
        this.Data.scrollPosition1.scrollToP = scrollTop;
        this.Data.ApplyChange(this);
    }

    /**
     * 
     * @param {*} e
     * @returns {void}
     * @memberof IndexPage
     */
    public draggleTouchHandler(e: any): void {
        var touchType = e.type;
        switch (touchType) {
            case "touchstart":
                this._scrollTouchStart(e);
                break;
            case "touchmove":
                this._scrollTouchMove(e);
                break;
            case "touchend":
                this._scrollTouchEnd(e);
                break;
        }
    }

    /**
     * 
     * @private
     * @param {any} e
     * @memberof IndexPage
     */
    private _scrollTouchStart(e: any): void {
        // console.log(e);
        var firstTouchPosition = {
            x: e.changedTouches[0].pageX,
            y: e.changedTouches[0].pageY,
        }
        console.log(e.changedTouches[0].pageX, e.changedTouches[0].pageY)
        var domData = this._getPositionDomByXY(firstTouchPosition);
        //movable-area滑块位置处理
        var movableX = firstTouchPosition.x;
        var movableY = firstTouchPosition.y - this.Data.scrollPosition1.top - this.Data.scrollPosition1.everyOptionCell / 2;

        console.log("firstTouchPosition:", firstTouchPosition);
        console.log("domData:", domData);
        console.log("movableX", movableX);
        console.log("movableY", movableY)
        this.Data.movableViewPosition = { x: movableX, y: movableY, className: "", data: domData };

        var secCode = domData.sDtSecCode;
        var secInfo = this._getOptionInfo(secCode);
        secInfo.selectPosition = e.changedTouches[0].clientY;
        secInfo.selectClass = "dragSelected";
        this.Data.optionsListData[secInfo.selectIndex].selectClass = "dragSelected";
        var optionsListData = this.Data.optionsListData;
        console.log("secInfo", secInfo);
        console.log("optionsListData", optionsListData);
        console.log("secInfo.selectIndex", secInfo.selectIndex);
        this.Data.scrollPosition1.scrollY = false;
        this.Data.selectItemInfo = secInfo;
        this.Data.optionsListData = optionsListData;
        this.Data.scrollPosition1.selectIndex = secInfo.selectIndex;
        this.Data.ApplyChange(this);
    }

    /**
     * 
     * @private
     * @param {any} e
     * @memberof IndexPage
     */
    private _scrollTouchMove(e: any): void {
        var selectItemInfo = this.Data.selectItemInfo;
        var selectPosition = selectItemInfo.selectPosition;
        var moveDistance = e.changedTouches[0].clientY;
        var everyOptionCell = this.Data.scrollPosition1.everyOptionCell;
        var optionsListData = this.Data.optionsListData;
        var selectIndex = selectItemInfo.selectIndex;

        console.log("e.changedTouches:", e.changedTouches);
        //movable-area滑块位置处理
        var movableX = e.changedTouches[0].pageX;
        var movableY = e.changedTouches[0].pageY - this.Data.scrollPosition1.top - this.Data.scrollPosition1.everyOptionCell;

        this.Data.movableViewPosition = {
            x: movableX,
            y: movableY,
            className: "",
            data: this.Data.movableViewPosition.data
        };
        this.Data.ApplyChange(this);

        if (moveDistance - selectPosition > 0 && selectIndex < optionsListData.length - 1) {
            if (optionsListData[selectIndex].sDtSecCode == selectItemInfo.sDtSecCode) {
                optionsListData.splice(selectIndex, 1);
                optionsListData.splice(++selectIndex, 0, selectItemInfo);
                selectPosition += everyOptionCell;
            }
        }

        if (moveDistance - selectPosition < 0 && selectIndex > 0) {
            if (optionsListData[selectIndex].sDtSecCode == selectItemInfo.sDtSecCode) {
                optionsListData.splice(selectIndex, 1);
                optionsListData.splice(--selectIndex, 0, selectItemInfo);
                selectPosition -= everyOptionCell;
            }
        }

        this.Data.selectItemInfo.selectPosition = selectPosition;
        this.Data.selectItemInfo.selectIndex = selectIndex;
        this.Data.optionsListData = optionsListData;
        this.Data.ApplyChange(this);
    }

    /**
     * 
     * @private
     * @param {any} e
     * @memberof IndexPage
     */
    private _scrollTouchEnd(e: any): void {
        console.log(e);
        var optionsListData = this._optionsDataTranlate(this.Data.optionsListData, "");

        this.Data.optionsListData = optionsListData;
        this.Data.scrollPosition1.scrollY = true;
        this.Data.movableViewPosition.class = "none";
        this.Data.ApplyChange(this);
    }

    /**
     * 
     * @private
     * @param {any} optionsList
     * @param {any} selectClass
     * @returns {any}
     * @memberof IndexPage
     */
    private _optionsDataTranlate(optionsList: any, selectClass: any): any {
        for (var i = 0, j = optionsList.length; i < j; i++) {
            optionsList[i].selectClass = selectClass;
        }
        return optionsList;
    }

    /**
     * 
     * @param {*} e
     * @returns {void}
     * @memberof IndexPage
     */
    public draggleTouch2Handler(e: any): void {
        var touchType = e.type;
        switch (touchType) {
            case "touchstart":
                this._scrollTouchStart2(e);
                break;
            case "touchmove":
                this._scrollTouchMove2(e);
                break;
            case "touchend":
                this._scrollTouchEnd2(e);
                break;
        }
    }

    /**
     * 
     * @private
     * @param {any} potions
     * @returns {any}
     * @memberof IndexPage
     */
    private _getPositionDomByXY2(potions: any): any {
        var y = potions.y - this.Data.scrollPosition2.top + this.Data.scrollPosition2.scrollTop;
        var x = potions.x - this.Data.scrollPosition2.left + this.Data.scrollPosition2.scrollLeft;
        console.log(potions.y, this.Data.scrollPosition2.top, this.Data.scrollPosition2.scrollTop, " potions.y - this.data.scrollPosition1.top + this.data.scrollPosition1.scrollTo")
        console.log(potions.x, this.Data.scrollPosition2.left, this.Data.scrollPosition2.scrollLeft, "potions.x - this.data.scrollPosition2.left + this.data.scrollPosition2.scrollLeft")
        var optionsListData = this.Data.optionsListData;
        console.log(optionsListData, "optionsListData")
        var everyOptionCell = this.Data.scrollPosition2.everyOptionCell;
        var everyOptionCell_Width = this.Data.scrollPosition2.everyOptionCell_Width;
        console.log(everyOptionCell, "everyOptionCell")
        console.log(everyOptionCell_Width, "everyOptionCell_Width")
        for (var i = 0, j = optionsListData.length; i < j; i++) {
            if (y >= i * everyOptionCell && y < (i + 1) * everyOptionCell && x >= i * everyOptionCell_Width && x < (i + 1) * everyOptionCell_Width) {
                return optionsListData[i];
            }
        }
        return optionsListData[0];
    }

    /**
     * 
     * @private
     * @param {any} e
     * @memberof IndexPage
     */
    private _scrollTouchStart2(e: any): void {
        // console.log(e);
        var firstTouchPosition = {
            x: e.changedTouches[0].pageX,
            y: e.changedTouches[0].pageY,
        }
        console.log(e.changedTouches[0].pageX, e.changedTouches[0].pageY)
        var domData = this._getPositionDomByXY2(firstTouchPosition);
        //movable-area滑块位置处理
        var movableX = firstTouchPosition.x - this.Data.scrollPosition2.left - this.Data.scrollPosition2.everyOptionCell_Width / 2;
        var movableY = firstTouchPosition.y - this.Data.scrollPosition2.top - this.Data.scrollPosition2.everyOptionCell / 2;

        console.log("firstTouchPosition:", firstTouchPosition);
        console.log("domData:", domData);
        console.log("movableX", movableX);
        console.log("movableY", movableY);
        this.Data.movableViewPosition = {
            x: movableX,
            y: movableY,
            className: "",
            data: domData
        };
        this.Data.ApplyChange(this);

        var secCode = domData.sDtSecCode;
        var secInfo = this._getOptionInfo(secCode);
        secInfo.selectPosition = e.changedTouches[0].clientY;
        secInfo.selectClass = "dragSelected";
        this.Data.optionsListData[secInfo.selectIndex].selectClass = "dragSelected";
        var optionsListData = this.Data.optionsListData;
        console.log("secInfo", secInfo);
        console.log("optionsListData", optionsListData);
        console.log("secInfo.selectIndex", secInfo.selectIndex);
        this.Data.scrollPosition1.scrollY = false;
        this.Data.selectItemInfo = secInfo;
        this.Data.optionsListData = optionsListData;
        this.Data.scrollPosition1.selectIndex = secInfo.selectIndex;
        this.Data.ApplyChange(this);
    }

    /**
     * 
     * @private
     * @param {any} e
     * @memberof IndexPage
     */
    private _scrollTouchMove2(e: any): void {
        var selectItemInfo = this.Data.selectItemInfo;
        var selectPosition = selectItemInfo.selectPosition;
        var moveDistance = e.changedTouches[0].clientY;
        var everyOptionCell = this.Data.scrollPosition1.everyOptionCell;
        var optionsListData = this.Data.optionsListData;
        var selectIndex = selectItemInfo.selectIndex;

        console.log("e.changedTouches:", e.changedTouches);
        //movable-area滑块位置处理
        var movableX = e.changedTouches[0].pageX;
        var movableY = e.changedTouches[0].pageY - this.Data.scrollPosition1.top - this.Data.scrollPosition1.everyOptionCell;

        this.Data.movableViewPosition = {
            x: movableX,
            y: movableY,
            className: "",
            data: this.Data.movableViewPosition.data
        };
        this.Data.ApplyChange(this);

        if (moveDistance - selectPosition > 0 && selectIndex < optionsListData.length - 1) {
            if (optionsListData[selectIndex].sDtSecCode == selectItemInfo.sDtSecCode) {
                optionsListData.splice(selectIndex, 1);
                optionsListData.splice(++selectIndex, 0, selectItemInfo);
                selectPosition += everyOptionCell;
            }
        }

        if (moveDistance - selectPosition < 0 && selectIndex > 0) {
            if (optionsListData[selectIndex].sDtSecCode == selectItemInfo.sDtSecCode) {
                optionsListData.splice(selectIndex, 1);
                optionsListData.splice(--selectIndex, 0, selectItemInfo);
                selectPosition -= everyOptionCell;
            }
        }

        this.Data.selectItemInfo.selectPosition = selectPosition;
        this.Data.selectItemInfo.selectIndex = selectIndex;
        this.Data.optionsListData = optionsListData;
        this.Data.ApplyChange(this);
    }

    /**
     * 
     * @private
     * @param {any} e
     * @memberof IndexPage
     */
    private _scrollTouchEnd2(e: any): void {
        console.log(e);
        var optionsListData = this._optionsDataTranlate(this.Data.optionsListData, "");

        this.Data.optionsListData = optionsListData;
        this.Data.scrollPosition1.scrollY = true;
        this.Data.movableViewPosition.className = "none";
        this.Data.ApplyChange(this);
    }

    /**
     * 
     * @private
     * @param {any} code
     * @memberof IndexPage
     */
    private _getOptionInfo(code: any): any {
        for (var i = 0, j = this.Data.optionsListData.length; i < j; i++) {
            var optionData = this.Data.optionsListData[i];
            if (optionData.sDtSecCode == code) {
                optionData.selectIndex = i;
                return optionData;
            }
        }
        return {};
    }

    /**
     * 
     * @private
     * @param {any} potions
     * @memberof IndexPage
     */
    private _getPositionDomByXY(potions: any): any {
        var y = potions.y - this.Data.scrollPosition1.top + this.Data.scrollPosition1.scrollTop;
        console.log(potions.y, this.Data.scrollPosition1.top, this.Data.scrollPosition1.scrollTop, " potions.y - this.data.scrollPosition1.top + this.data.scrollPosition1.scrollTo")
        var optionsListData = this.Data.optionsListData;
        console.log(optionsListData, "optionsListData")
        var everyOptionCell = this.Data.scrollPosition1.everyOptionCell;
        console.log(everyOptionCell, "everyOptionCell")
        for (var i = 0, j = optionsListData.length; i < j; i++) {
            if (y >= i * everyOptionCell && y < (i + 1) * everyOptionCell) {
                console.log(y >= i * everyOptionCell && y < (i + 1) * everyOptionCell, "y >= i * everyOptionCell && y < (i + 1) * everyOptionCell")
                console.log(optionsListData[i], "optionsListData[i]")
                return optionsListData[i];
            }
        }
        return optionsListData[0];
    }
}

Page(new IndexPage());
